<!DOCTYPE html>
<html>
<head>
	<title></title>
	<meta charset="utf-8">
	<style type="text/css">
	table{
		border-collapse:collapse;
		width:95%;
		margin:0 auto;
	}
	tr{
		width:15%;height:100px;
	}
	#demo{
    overflow:hidden;
    height:1000px;
    width:100%;
    margin-top:40px; 
 }
	</style>
</head>
<body>
<audio src="1.mp3" autoplay control loop>
  您的浏览器不支持Audio标签
</audio>
<div id="demo">
  <div id="demo1">
<table border="1">
  <tr>
  	<td>1</td>
  	<td>2</td>
  	<td>3</td>
  	<td>4</td>
  	<td>5</td>
  	<td>6</td>
  </tr>
  <tr>
  	<td>7</td>
  	<td>8</td>
  	<td>9</td>
  	<td>10</td>
  	<td>11</td>
  	<td>12</td>
  </tr>
  <tr>
  	<td>13</td>
  	<td>14</td>
  	<td>15</td>
  	<td>16</td>
  	<td>17</td>
  	<td>18</td>
  </tr>
  <tr>
  	<td>19</td>
  	<td>20</td>
  	<td>21</td>
  	<td>22</td>
  	<td>23</td>
  	<td>24</td>
  </tr>
  <tr>
  	<td>25</td>
  	<td>26</td>
  	<td>27</td>
  	<td>28</td>
  	<td>29</td>
  	<td>30</td>
  </tr>
  <tr>
  	<td>31</td>
  	<td>32</td>
  	<td>33</td>
  	<td>34</td>
  	<td>35</td>
  	<td>36</td>
  </tr>
  <tr>
  	<td>37</td>
  	<td>38</td>
  	<td>39</td>
  	<td>40</td>
  	<td>41</td>
  	<td>42</td>
  </tr>
  <tr>
  	<td>43</td>
  	<td>44</td>
  	<td>45</td>
  	<td>46</td>
  	<td>47</td>
  	<td>48</td>
  </tr>
  <tr>
  	<td>49</td>
  	<td>50</td>
  	<td>51</td>
  	<td>52</td>
  	<td>53</td>
  	<td>54</td>
  </tr>
  <tr>
  	<td>55</td>
  	<td>56</td>
  	<td>57</td>
  	<td>58</td>
  	<td>59</td>
  	<td>60</td>
  </tr>
  <tr>
  	<td>61</td>
  	<td>62</td>
  	<td>63</td>
  	<td>64</td>
  	<td>65</td>
  	<td>66</td>
  </tr>
  <tr>
  	<td>67</td>
  	<td>68</td>
  	<td>69</td>
  	<td>70</td>
  	<td>71</td>
  	<td>72</td>
  </tr>
  <tr>
  	<td>73</td>
  	<td>74</td>
  	<td>75</td>
  	<td>76</td>
  	<td>77</td>
  	<td>78</td>
  </tr>
  <tr>
  	<td>79</td>
  	<td>80</td>
  	<td>81</td>
  	<td>82</td>
  	<td>83</td>
  	<td>84</td>
  </tr>
  <tr>
  	<td>85</td>
  	<td>86</td>
  	<td>87</td>
  	<td>88</td>
  	<td>89</td>
  	<td>90</td>
  </tr>
  <tr>
  	<td>91</td>
  	<td>92</td>
  	<td>93</td>
  	<td>94</td>
  	<td>95</td>
  	<td>96</td>
  </tr>
  <tr>
  	<td>97</td>
  	<td>98</td>
  	<td>99</td>
  	<td>99</td>
  	<td>100</td>
  	<td>101</td>
  </tr>
  <tr>
  	<td>102</td>
  	<td>103</td>
  	<td>104</td>
  	<td>105</td>
  	<td>106</td>
  	<td>107</td>
  </tr>
  <tr>
  	<td>108</td>
  	<td>109</td>
  	<td>110</td>
  	<td>111</td>
  	<td>112</td>
  	<td>113</td>
  </tr>
</table>
</div>
<div id="demo2"></div>
</div>
<script type="text/javascript" src="jquery-2.2.4.js"></script>
<script type="text/javascript">
	// var timer=setInterval(function scroll(){
	// 	var length_tr=$("table tr").length;
		
	// },100);
$(function(){
	var speed = 0 ;  
	demo2.innerHTML = demo1.innerHTML;  
	function Marquee() {  
   		if (demo2.offsetTop - demo.scrollTop <= 0) {  
      	 demo.scrollTop -= demo1.offsetHeight;  
    	} else {  
        	demo.scrollTop++;  
    	}  
	}  
	var MyMar = setInterval(Marquee, speed);  
  
	demo.onmouseover = function() {  
   	 	clearInterval(MyMar);  
	}    
	demo.onmouseout = function() {  
   		MyMar = setInterval(Marquee, speed);  
	}
}) 

</script>
</body>
</html>